<template>
  <div>
    <h3 style="text-align:center;">{{ article.article_name }}</h3>
    <el-divider content-position="center">{{ article.writer }}</el-divider>
    <!-- <div style="margin-left:13%;width:800px">
      <pre style="white-space: pre-wrap">{{ line_feed }}</pre>
    </div> -->
    <div
      v-html="content"
      style="margin-left:11%;margin-top:-2%;width:800px"
    ></div>
    <div style="margin-left:60%;margin-top:5%">
      <el-button type="primary" @click="returnArticle">返回</el-button>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      article: {},
      content: ""
    };
  },
  methods: {
    findArticle() {
      this.article = this.$store.state.article;
      this.content = this.article.content.replace(
        /\\n/g,
        "<br><br>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp"
      );
    },
    returnArticle() {
      this.$router.push({ path: "/student/article_search" });
    }
  },
  mounted() {
    this.findArticle();
  },
  computed: {}
};
</script>
<style scoped></style>
